<template>
	<view class="share_controller">
		<view class="bg_view animate__animated animate__fadeIn">
			<image mode="scaleToFill" class="bg_img " :src="bg_datas[bg_select_item_index].bg_img"></image>
			<image mode="widthFix" class="bg_img_top" :src="bg_datas[bg_select_item_index].bg_img_top"></image>
			<image mode="widthFix" class="bg_img_bottom  animate__animated animate__fadeInUp"
				:src="bg_datas[bg_select_item_index].bg_img_bottom"></image>
		</view>
		<view class="text_conetent ">
			<view class="con_v">
				<view class="text">{{data_info.userName}}祝您新年快乐</view>
				<view class="text">{{data_info.text}}</view>
			</view>
			<image v-if="ismake == false" @click="visible_modal = true"
				class="btn animate__animated animate__backInRight  " src="/static/img/btn_make_self.png"></image>
			<image v-if="ismake" @click="share_click()" class="btn animate__animated animate__backInRight"
				src="/static/img/btn_share_friend.png"></image>

		</view>
		<view class="modal " v-if="visible_modal">
			<view class="bg_v animate__animated animate__fadeIn" @click="visible_modal = false"></view>
			<view class="content animate__animated animate__bounceInDown">
				<view class="title">扫码去好健忆公众号 </view>
				<view class="title">关注公众号制作我的新年海报</view>
				<image src="/static/img/er_code_02.jpg"></image>
				<view class="title" style="font-size: 24rpx;">好健忆 致力于认知障碍疾病科普</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: 0,
				data_info: {

				},
				title: '',
				url: '',
				ismake: false,
				visible_modal: false,
				bg_select_item_index: 0,
				bg_datas: [{
						bg_img: '/static/img/bg_01_01.png',
						bg_img_top: '/static/img/bg_01_02.png',
						bg_img_bottom: '/static/img/bg_01_03.png',
					},
					{
						bg_img: '/static/img/bg_02_01.png',
						bg_img_top: '/static/img/bg_02_02.png',
						bg_img_bottom: '/static/img/bg_02_03.png',
					},
					{
						bg_img: '/static/img/bg_03_01.png',
						bg_img_top: '/static/img/bg_03_02.png',
						bg_img_bottom: '/static/img/bg_03_03.png',
					},
				],

			}
		},
		onLoad(e) {
			this.id = e.id
			this.url = this.baseUrl + '/pages/share/share?id=' + this.id

			this.load_shearData()
			var that = this
			//    if(e.ismake == 1){
			// 	that.ismake = true;
			// }
			const ismake = uni.getStorageSync('ismake');
			if (ismake) {
				that.ismake = true;
				 uni.removeStorageSync('ismake');
			}

			uni.$once('make', () => {
				that.ismake = true;
			})
		},
		onShareAppMessage(options) {
			let title = "默认标题";

			return {
				title: title
			}
		},
		methods: {
			load_shearData() {
				var that = this
				this.service("/shareRecord/get", 'get', {
					id: this.id
				}).then(res => {
					console.log(res)
					that.data_info = res.data
					that.bg_select_item_index = res.data.type
					that.title = `${res.data.userName}祝您新年快乐`

					uni.setNavigationBarTitle({
						title: that.title
					})
				})

				this.service("/shareRecord/getWxConfig", 'get', {
					url: that.url
				}).then(res => {
					console.log(res)
					that.wechatStart(res.data)
				})


			},
			//参考链接 https://blog.csdn.net/weixin_42269070/article/details/108258529
			wechatStart(obj) {
				var wx = this.$wx;
				var that = this
				wx.config({
					debug: false, // true时，手机微信环境访问会alert一些errmsg信息，如果显示errmsg:ok表示正常，否认表示出了问题
					appId: obj.appId, // 必填，公众号的唯一标识
					timestamp: parseInt(obj.timestamp), // 后台返回的数据中取
					nonceStr: obj.nonceStr, // 后台返回的数据中取
					signature: obj.signature, // 后台返回的数据中取
					jsApiList: ["updateTimelineShareData", "updateAppMessageShareData"] // 必填，需要使用的JS接口列表
				})
				// 需在用户可能点击分享按钮前就先调用，说白了就是放在文章详情信息读取完后就可以执行下面的wx.ready()方法
				wx.ready(function() {

					// 自定义“分享给朋友”及“分享到QQ”按钮的分享内容
					wx.updateAppMessageShareData({
						title: that.title, // 分享标题
						desc: that.data_info.text, // 分享描述
						link: that.url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
						imgUrl: 'http://hjylb.peanut-data.com/static/img/share_link.png', // 分享图标
						success: function() {
							// 设置成功
						}
					})
					// 自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容
					wx.updateTimelineShareData({
						title: that.title, // 分享标题
						link: that.url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
						imgUrl: 'http://hjylb.peanut-data.com/static/img/share_link.png', // 分享图标
						success: function() {
							// 设置成功
						}
					})
				})
			},
			share_click() {
				uni.showModal({
					content: '点击右上角“...”按钮转发、分享朋友圈，邀请好友送出新年祝福',
					showCancel: false
				})
			}

		}
	}
</script>

<style lang="scss">
	// @import '/static/animate.min.css';
	@import './share.scss';
</style>
